import React, { PureComponent } from 'react';
import { StyleSheet, View, TouchableOpacity } from 'react-native';

import HomeGridItem from './HomeGridItem'
import api from '../../api'
type Props = {
  onGridItem?: Function
}
type State = {

}

class HomeGridView extends PureComponent<Props, State> {
  constructor(props) {
    super(props);
    this.state = {
    };
  }

  render () {
    return (
      <View style={styles.container}>
        {
          api.discount.data.map((e, index) => (
            <TouchableOpacity key={index} onPress={() => {
              this.props.onGridItem(e)
            }}>
              <HomeGridItem key={index} Desc={e.deputytitle} Title={e.title} TitleStyle={{ color: e.typeface_color }} DescStyle={{ color: e.deputy_typeface_color }} />
            </TouchableOpacity>
          ))
        }
      </View >
    );
  }
}

const styles = StyleSheet.create({
  container: {
    marginTop: 14,
    marginBottom: 10,

    flexDirection: 'row',
    flexWrap: 'wrap'
  }
})
export default HomeGridView;